import {Effect, Model, SubscriptionsMapObject} from 'dva-core-ts';
import {Reducer} from 'redux';
import axios from 'axios';
import {homeGuess, homeChannel} from './../api/home';
import {RootState} from '@/models/index';

const CAROUSEL_URL = '/mock/13/carousel';
// 轮播图数据接口
export interface ICarousel {
  id: string;
  image: string;
  colors: [string, string];
}
// 猜你喜欢数据接口
export interface IGuess {
  id: string;
  title: string;
  image: string;
}
// 首页列表数据接口
export interface IChannel {
  id: string;
  title: string;
  image: string;
  remark: string;
  played: number;
  playing: number;
}
// 首页列表数据分页接口
export interface IPagination {
  current: number; //当前页数
  total: number; // 数据总数
  hasMore: boolean; // 是否还有更多数据
}
export interface HomeState {
  carousels: ICarousel[];
  activeCarouselIndex: number; //轮播图当前页面索引
  guess: IGuess[];
  channels: IChannel[];
  pagination: IPagination;
  gradientVisible: boolean; //轮播图顶部渐变色是否显示
}
interface HomeModal extends Model {
  namespace: 'home';
  state: HomeState;
  reducers?: {
    setState: Reducer<HomeState>;
  };
  effects?: {
    fetchCarousels: Effect;
    fetchGuess: Effect;
    fetchChannel: Effect;
  };
  subscriptions?: SubscriptionsMapObject;
}
// function delay(timeout: number) {
//   return new Promise(resolve => {
//     setTimeout(() => {
//       resolve('timeout');
//     }, timeout);
//   });
// }
const initialState = {
  carousels: [],
  guess: [],
  channels: [],
  pagination: {
    current: 1,
    total: 0,
    hasMore: true,
  },
  activeCarouselIndex: 0,
  gradientVisible: true,
};
const homeModel: HomeModal = {
  namespace: 'home',
  state: initialState,
  reducers: {
    setState(state = initialState, {payload}) {
      return {
        ...state,
        ...payload,
      };
    },
  },
  effects: {
    // 轮播数据
    *fetchCarousels(_, {call, put}) {
      const {data} = yield call(axios.get, CAROUSEL_URL);
      yield put({
        type: 'setState',
        payload: {
          carousels: data,
        },
      });
    },
    // 猜你喜欢
    *fetchGuess(_, {call, put}) {
      const {data} = yield call(homeGuess);
      yield put({
        type: 'setState',
        payload: {
          guess: data,
        },
      });
    },
    // 首页列表
    *fetchChannel({payload, callback}, {call, put, select}) {
      let {channels, pagination} = yield select(
        (state: RootState) => state.home,
      );
      // 初始化当前页数
      let page = 1;
      // 是否是第一次  loadMore为触底加载更多时传入  第一次无
      if (payload?.loadMore) {
        page = pagination.current + 1;
      }
      const {data} = yield call(homeChannel, {
        page,
      });
      let newChannels = data.results;
      // 如果是触底加载更多则合并新加载数据与旧数据
      if (payload?.loadMore) {
        newChannels = channels.concat(newChannels);
      }
      yield put({
        type: 'setState',
        payload: {
          channels: newChannels,
          pagination: {
            current: data.pagination.current,
            total: data.pagination.total,
            hasMore: newChannels.length < data.pagination.total,
          },
        },
      });
      if (typeof callback === 'function') {
        callback();
      }
    },
  },
  subscriptions: {
    setup({dispatch}) {
      dispatch({type: 'fetchGuess'});
      dispatch({type: 'fetchCarousels'});
      dispatch({type: 'fetchChannel'});
    },
  },
};

export default homeModel;
